<template>
	<view>
			<view class="type" v-for="(item,index) in questionType">
				<view>
					<text style="color: #E8815E;padding-right: 20rpx;">.</text>{{item.name}}
				</view>
				<view>
					<view class="number">
						<view>
							<text style="color: #E8815E;font-size: 28rpx;">23</text><text style="opacity: 80%;color: gainsboro;">/</text><text style="color: #90A674;font-size: 28rpx;">56</text>
						</view> 
						<view><image src="../../static/ylovrn/箭头.png" @click="navigator"></image></view> 
					</view>
				</view>
			</view>
			
	</view>
</template>

<script>
	export default {
		data() {
			return {
				questionType:[
					{id:1,name:"名词解释"},
					{id:2,name:"选择题"},
					{id:3,name:"判断题"},
					{id:4,name:"填空题"},
					{id:5,name:"解答题"}
				],
			}
		},
		methods: {
			navigator() {
				uni.navigateTo({
					url:'/pages/viewMemorize/viewMemorize'
				});
			}
		}
	}
</script>

<style>
	body {
		color: #F0EEEF;
	}
	/* 题目类型名 */
	.type {
		display: flex;
		justify-content: space-between;
		align-items: center;
		width: 700rpx;
		height: 100rpx;
		border:2rpx solid whitesmoke;
		border-radius: 30rpx;
		margin: 20rpx;
		margin-top: 40rpx;
	}
	.type >view:nth-child(1) {
		padding-left: 20rpx;
		color: black;
		opacity: 90%;
		font-size: 28rpx;
	}
	.type image{
		width: 20rpx;
		height: 20rpx;
		border:2rpx solid whitesmoke; 
		border-radius: 20rpx;
	}
	.number {
		display: flex;
		padding-right: 60rpx;
	}
	.number view:nth-child(2) {
		padding-left: 30rpx;
	}

</style>
